$(document).ready(function() {
	var dpFunc = $.datepicker._generateHTML; //record the original
	$.datepicker._generateHTML = function(inst){
		var thishtml = $( dpFunc.call($.datepicker, inst) ); //call the original
		
		thishtml = $('<div />').append(thishtml); //add a wrapper div for jQuery context
		
		//locate the button panel and add our button - with a custom css class.
		$('.ui-datepicker-buttonpane', thishtml).prepend(
			$('<button class="\
				ui-datepicker-clear ui-state-default ui-priority-primary ui-corner-all\
				"\>Clear</button>'
			).click(function(){
				inst.input.attr('value', 'clear');
				inst.input.datepicker('hide');
			})
		);
		
		thishtml = thishtml.children(); //remove the wrapper div
		
		return thishtml; //assume okay to return a jQuery
	};

	$('.picker-monthyear').datepicker({
	   	changeMonth: true,
		changeYear: true,
		dateFormat: 'mm/yy',
		showButtonPanel: true,
		
		onClose: function() {

	   		if($(this).val() == 'clear') {
	   			$(this).datepicker('setDate', null);
	   		}
	   		else {
	   			var iMonth = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
				var iYear = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
				$(this).datepicker('setDate', new Date(iYear, iMonth));
	   		}	 
		 },
		
		onDone: function(){alert('ss');
			var iMonth = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
			var iYear = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
			$(this).datepicker('setDate', new Date(iYear, iMonth));
		},
		
	     beforeShow: function() {
			$("body").addClass("ui-datepicker-hide");
			if ((selDate = $(this).val()).length > 0) 
			{
	          iYear 	= selDate.substring(selDate.length - 4, selDate.length);
			  iMonth 	= selDate.substring(0, selDate.length - 5) - 1;
	          /*iMonth = jQuery.inArray(selDate.substring(0, selDate.length - 5), $(this).datepicker('option', 'monthNames'));*/
	          $(this).datepicker('option', 'defaultDate', new Date(iYear, iMonth));
	          $(this).datepicker('setDate', new Date(iYear, iMonth));
	       }
	    }
  });
   
  $('.picker-date').datepicker({
	   	changeMonth: true,
		changeYear: true,
		dateFormat: 'dd/mm/yy',
		showButtonPanel: true,
		
		onClose: function() {
	   		if($(this).val() == 'clear') {
	   			$(this).datepicker('setDate', null);
	   		}	   		 
		 },
		
		beforeShow: function() {
	  		$("body").removeClass("ui-datepicker-hide");
	    }
 });
  
});